
<div class="form-group" ng-repeat="config in $ctrl.items">
  <label class="col-sm-3 control-label">
    <span>{{config.name}}</span>
    <span class="ml-xxs text-danger" ng-show="config.required">
      <i class="fa fa-asterisk"></i>
    </span>
  </label>
  <div class="col-sm-9" ng-switch="$ctrl.typeOf(config)">
    <input ng-switch-when="string" class="form-control" type="text" ng-required="config.required" ng-model="$ctrl.configuration[config.name]">
    <input ng-switch-when="number" class="form-control" type="number" ng-required="config.required" ng-model="$ctrl.configuration[config.name]">
    <textarea ng-switch-when="text" class="form-control vertical" rows="5" ng-required="config.required" ng-model="$ctrl.configuration[config.name]"></textarea>
    <div ng-switch-when="boolean">
      <div class="btn-group">
        <label uib-btn-radio="true" class="btn btn-default" ng-model="$ctrl.configuration[config.name]">True</label>
        <label uib-btn-radio="false" class="btn btn-default" ng-model="$ctrl.configuration[config.name]">False</label>
      </div>
    </div>
    
    <div ng-switch-when="multi-string" class="clearfix">
      <div class="clearfix">
        <a class="pull-right" href ng-click="$ctrl.addOption(config)">Add option</a>
      </div>
    
      <div class="input-group mb-xxxs" ng-repeat="val in $ctrl.configuration[config.name] track by $index">
        <span class="input-group-addon">{{$index+1}}.</span>
        <input class="form-control" type="text" ng-model="$ctrl.configuration[config.name][$index]" ng-required="config.required">
        <span class="input-group-btn">
          <button class="btn btn-default" type="button" ng-click="$ctrl.removeOption(config.name, $index)">
            <i class="fa fa-times text-danger"></i>
          </button>
        </span>
      </div>
    </div>
    
    <div ng-switch-when="multi-number" class="clearfix">
      <div class="clearfix">
        <a class="pull-right" href ng-click="$ctrl.addOption(config)">Add option</a>
      </div>
      <div class="input-group mb-xxxs" ng-repeat="val in $ctrl.configuration[config.name] track by $index">
        <span class="input-group-addon">{{$index+1}}.</span>
        <input class="form-control" type="number" ng-model="$ctrl.configuration[config.name][$index]" ng-required="config.required">
        <span class="input-group-btn">
          <button class="btn btn-default" type="button" ng-click="$ctrl.removeOption(config.name, $index)">
            <i class="fa fa-times text-danger"></i>
          </button>
        </span>
      </div>
    </div>
    
    <div ng-switch-when="multi-boolean" class="clearfix">
      <div class="pull-right">
        <a href ng-click="$ctrl.addOption(config)">Add option</a>
      </div>
      <div class="mb-xxxs" ng-repeat="val in $ctrl.configuration[config.name] track by $index">
        <div class="btn-group">
          <label uib-btn-radio="true" class="btn btn-default" ng-model="$ctrl.configuration[config.name][$index]">True</label>
          <label uib-btn-radio="false" class="btn btn-default" ng-model="$ctrl.configuration[config.name][$index]">False</label>
        </div>
        <button class="btn btn-default" type="button" ng-click="$ctrl.removeOption(config.name, $index)">
          <i class="fa fa-times text-danger"></i>
        </button>
      </div>
    </div>
    <p class="help-block">{{config.description}}</p>
  </div>
</div>